<template>
	<!-- 轮播海报 -->
	<uni-popup ref="popup" type="center" :catchtouchmove="true" :is-mask-click="false" mask-background-color="rgba(0,0,0,1)">
		<swiper class="swiper" circular :indicator-dots="true" :autoplay="false" indicator-color="rgba(0,0,0,0.5)"
			indicator-active-color="rgba(255,255,255,0.8)">
			<block v-for="(item,index) in imageList" :key="index">
				<swiper-item>
					<view class="swiper-item">
						<!-- 点击跳转到购买抵扣券页面  -->
						<image :src="IMG_URL + item.image" mode="scaleToFill" @click="$navigateTo('/pages/active/doubleEleven')"></image>
						<image src="../../static/home/close.png" mode="scaleToFill" @click="$refs.popup.close()">
						</image>
					</view>
				</swiper-item>
			</block>
		</swiper>
		
		
	</uni-popup>
</template>

<script>
	import api from '@/api/home.js'
	// import Popup from '@/uni_modules/uni-popup/components/uni-popup/uni-popup.vue';
	export default {
		components: {
			// Popup
		},
		props: {
			imageList: {
				type: Array,
				default: () => []
			},
			
			IMG_URL: {
				type: String,
				default: ""
			}
		},
		components: {},
		data() {
			return {
			};
		},
		onLoad(options) {
			
		},
		mounted() {
			// this.open();
		},
		methods: {
			open() {
				this.$refs.popup.open('center');
			},
			close() {
				this.$refs.popup.close();
			}
		},
	}
</script>
<style lang='scss' scoped>
	
	.swiper {
		position: relative;
		width: 100vw;
		height: 80vh;

		.swiper-item {
			width: 100vw;
			height: 70vh;
			display: flex;
			flex-direction: column;
			align-items: center;

			>image:nth-child(1) {
				width: 600rpx;
				height: 800rpx;
				border-radius: 24rpx;
				margin-bottom: 60rpx;
			}

			>image:nth-child(2) {
				width: 60rpx;
				height: 60rpx;
				display: block;
				flex-shrink: 0;
			}
		}
	}
</style>
